<template>
    <div v-loading="loading" style="margin-right: 1em">
        <h4 style="margin-bottom: 1em">近期通知</h4>
        <el-scrollbar height="auto">
            <el-button class="scrollbar-demo-item"
                       v-for="inform in informList" :key="inform.id"
                       @click="check(inform.id)"
            >{{ inform.title }}</el-button>
        </el-scrollbar>
    </div>
</template>

<script setup>
import {ref} from 'vue'
import {useRouter} from "vue-router";
import {getInformListBySearchApi} from "@/apis/search";

const router = useRouter()
/******************* 通知 ***********************/
let loading = ref(true)
let informList = ref([]);
getInformListBySearchApi(1, 8).then((
    res =>{
        informList.value = res.data.content
        loading.value = false
    }
))
const check = id => {
    const {href} = router.resolve({
        name: "previewInform",
        params: {id}
    })
    window.open(href, "_blank")
}
</script>


<style scoped lang="scss">
.scrollbar-demo-item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    margin: 0.75em 0;
    background: #D4D7DE;
    color: #606266;
}
</style>